import * as obj from '../public.js';
import { cookie } from '../../public/cookieFnNew.js';
const o = obj.default;
// 获取登录事件
const petU = cookie.getCookie('petUserD') ? cookie.getCookie('petUserD') : '';
// 获取selection元素
// const selection = o.$('.selection')

if (o.$('.top_right') && o.$('.people')) {
  // o.$('.top_right').remove()
  const top_right = o.$('.top_right')
  const people = o.$('.people')
  // console.log(top_right)
  // console.log(people)

  // 如果没登陆获取登录 || 注册 元素
  // const a = o.$('.a') ? o.$('.a') : '';
  // const b = o.$('.b') ? o.$('.b') : ''
  // 如果有petu
  console.log(!!petU)
  if (petU) {
    // 登录注册元素隐藏
    top_right.style.display = 'none';
    selection.style.display = 'flex';
    selection.addEventListener('mouseover', function () {
      ul.style.display = 'block'
    })
    selection.addEventListener('mouseleave', function () {
      ul.style.display = 'none'
    })
  } else {
    top_right.style.display = 'flex';
    selection.style.display = 'none'
    // 创建登录事件
    a.onclick = function () {
      location.href = './login.html'
    }
    // 创建注册点击事件
    b.onclick = function () {
      location.href = './register.html'
    }
  }

  const ul = people.nextElementSibling
  // people 添加点击事件 
  people.addEventListener('click', function () {
    // 如果下拉菜单隐藏
    if (ul.style.display === 'none') {
      // 显示下拉菜单
      ul.style.display = 'block';
    } else {
      // 否则隐藏下拉菜单
      ul.style.display = 'none';
    }
  })
  // ul 下拉菜单设置点击事件
  ul.addEventListener('click', function (eve) {
    const e = eve || window.event;
    const target = e.target || e.srcElement;
    const li = ul.children;
    const lis = [...li];
    // 通过事件委托给li添加索引
    lis.forEach((val, idx) => {
      val.index = idx
    });
    // 点击之后隐藏下拉菜单
    ul.style.display = 'none';
    
    if (target.index === 0) {
      location.href = './people.html'
    } else if (target.index === 1) {
      location.href = './shopcart.html'
    } else {
      cookie.removeCookie('petUserD')
      people.style.display = 'none';
      top_right.style.display = 'flex';
      a.onclick = function () {
        location.href = './login.html'
      }
      b.onclick = function () {
        location.href = './register.html'
      }
    }
  })


}


{/* <div class="selection" style="height: 100%; background-color: red;position: relative;">
<div class="people">
  <div class="iconfont icon-gerenfill touxiang"></div>
  <span class="triangle"></span>
</div>
<ul style="display:none">
  <li><span class="iconfont icon-zerenren"></span>个人主页</li>
  <li><span class="iconfont icon-31gouwuche"></span>购物车</li>
  <li><span class="iconfont icon-tuichu"></span>退出登录</li>
</ul>
</div> */}